<script setup lang="ts">
import { reactive, defineProps, defineEmits, watch, ref } from 'vue';
import { getRecordByVillageId } from '#/api/core/heatingSeason';
const rowId = ref(); // 存储当前行的id
const props = defineProps({
  open: {
    type: Boolean,
    default: false,
  },
  data: {
    type: Number || String,
    default: '',
  },
});

const page = ref(1);
const limit = ref(10);
const tableData = ref([]); // 表格数据
const getList = async () => {
  console.log('rowId', rowId.value);
  let data = {
    id: rowId.value,
    page: page.value,
    limit: limit.value,
  };
  let res = await getRecordByVillageId(data);
  if (res.length > 0) {
    tableData.value = res;
  }
  console.log('res', res);
};

const emit = defineEmits(['close']);
const onClose = () => {
  emit('close');
};
// 获取表格数据
const columns = [
  {
    title: '小区名称',
    dataIndex: 'villageName',
    key: 'villageName',
    align: 'center',
    width: 200,
  },
  {
    title: '小区类型',
    dataIndex: 'villageType',
    key: 'villageType',
    align: 'center',
  },
  {
    title: '机构',
    dataIndex: 'comName',
    key: 'comName',
    align: 'center',
    width: 200,
  },
  {
    title: '收费期',
    dataIndex: 'year',
    key: 'year',
    align: 'center',
  },
  {
    title: '计划应收全费',
    children: [
      {
        title: '户数(户)',
        dataIndex: 'rcvbFullHouses',
        key: 'rcvbFullHouses',
        align: 'center',
      },
      {
        title: '面积(㎡)',
        dataIndex: 'rcvbFullArea',
        key: 'rcvbFullArea',
        align: 'center',
      },
      {
        title: '金额(元)',
        dataIndex: 'rcvbFullMoney',
        key: 'rcvbFullMoney',
        align: 'center',
      },
    ],
  },
  {
    title: '计划应收基本费',
    children: [
      {
        title: '户数(户)',
        dataIndex: 'rcvbBaseHouses',
        key: 'rcvbBaseHouses',
        align: 'center',
      },
      {
        title: '面积(㎡)',
        dataIndex: 'rcvbBaseArea',
        key: 'rcvbBaseArea',
        align: 'center',
      },
      {
        title: '金额(元)',
        dataIndex: 'rcvbBaseMoney',
        key: 'rcvbBaseMoney',
        align: 'center',
      },
    ],
  },
  {
    title: '计划应收合计(全费+基本费)',
    children: [
      {
        title: '户数(户)',
        dataIndex: 'allReceivableHouses',
        key: 'allReceivableHouses',
        align: 'center',
      },
      {
        title: '面积(㎡)',
        dataIndex: 'allReceivableArea',
        key: 'allReceivableArea',
        align: 'center',
      },
      {
        title: '金额(元)',
        dataIndex: 'allReceivableMoney',
        key: 'allReceivableMoney',
        align: 'center',
      },
    ],
  },
  {
    title: '上一采暖季实收合计(全费+基本费)',
    children: [
      {
        title: '户数(户)',
        dataIndex: 'beforeReceivableHouses',
        key: 'beforeReceivableHouses',
        align: 'center',
      },
      {
        title: '面积(㎡)',
        dataIndex: 'beforeReceivableArea',
        key: 'beforeReceivableArea',
        align: 'center',
      },
      {
        title: '金额(元)',
        dataIndex: 'beforeReceivableMoney',
        key: 'beforeReceivableMoney',
        align: 'center',
      },
    ],
  },
  {
    title: '本期采暖季实收合计(全费+基本费)',
    children: [
      {
        title: '户数(户)',
        dataIndex: 'nowReceivableHouses',
        key: 'nowReceivableHouses',
        align: 'center',
      },
      {
        title: '面积(㎡)',
        dataIndex: 'nowReceivableArea',
        key: 'nowReceivableArea',
        align: 'center',
      },
      {
        title: '金额(元)',
        dataIndex: 'nowReceivableMoney',
        key: 'nowReceivableMoney',
        align: 'center',
      },
    ],
  },
  {
    title: '计划-上一采暖季实收合计差额',
    children: [
      {
        title: '户数(户)',
        dataIndex: 'beforeDifferenceReceivableHouses',
        key: 'beforeDifferenceReceivableHouses',
        align: 'center',
      },
      {
        title: '面积(㎡)',
        dataIndex: 'beforeDifferenceReceivableArea',
        key: 'beforeDifferenceReceivableArea',
        align: 'center',
      },
      {
        title: '金额(元)',
        dataIndex: 'beforeDifferenceReceivableMoney',
        key: 'beforeDifferenceReceivableMoney',
        align: 'center',
      },
    ],
  },
  {
    title: '计划-本期采暖季实收合计差额',
    children: [
      {
        title: '户数(户)',
        dataIndex: 'nowDifferenceReceivableHouses',
        key: 'nowDifferenceReceivableHouses',
        align: 'center',
      },
      {
        title: '面积(㎡)',
        dataIndex: 'nowDifferenceReceivableArea',
        key: 'nowDifferenceReceivableArea',
        align: 'center',
      },
      {
        title: '金额(元)',
        dataIndex: 'nowDifferenceReceivableMoney',
        key: 'nowDifferenceReceivableMoney',
        align: 'center',
      },
    ],
  },
  {
    title: '状态',
    dataIndex: 'status',
    key: 'status',
    align: 'center',
  },
  {
    title: '修改人',
    dataIndex: 'createPersonName',
    key: 'createPersonName',
    align: 'center',
  },
  {
    title: '修改时间',
    dataIndex: 'createTime',
    key: 'createTime',
    align: 'center',
  },
  {
    title: '操作',
    dataIndex: 'active', // 这里的 dataIndex 必须和 dataSource 中的 key 一致
    key: 'active', // 这里的 key 必须和 dataSource 中的 key 一致
    width: 250,
    align: 'center',
    fixed: 'right',
  },
];

watch(
  () => [props.open, props.data],
  ([newOpen, newdata]) => {
    rowId.value = newdata;
    if (newOpen) {
      getList();
    }
  },
  { immediate: true, deep: true },
);
</script>

<template>
  <div>
    <a-modal
      v-model:open="props.open"
      title="采暖季应收计划修改记录"
      :footer="null"
      @cancel="onClose"
      :width="1050"
    >
      <a-table
        class="ant-table-striped"
        size="middle"
        :columns="columns"
        :data-source="tableData"
        :row-class-name="
          (_record: any, index: number) =>
            index % 2 === 1 ? 'table-striped' : null
        "
        :pagination="false"
        bordered
        :scroll="{ x: 3000 }"
        style="width: 1000px"
      >
      </a-table>
    </a-modal>
  </div>
</template>

<style lang="css" scoped></style>
